<%--
    Document   : pantallaPrincipal
    Created on : Nov 18, 2012, 8:35:12 PM
    Author     : JOSE
--%>
<%@page import="modelos.Usuario"%>
<%@page import="Herramientas.Constantes"%>
<%
    Usuario usuario = (Usuario)request.getSession().getAttribute("usuarioActual");
%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
        <meta charset="UTF-8">
            <title>Reciclado</title>
            <link media="screen" type="text/css" href="css/standalone.css" rel="stylesheet"/>
            <link media="screen" type="text/css" href="css/tabs.css" rel="stylesheet"/>
            <link media="screen" type="text/css" href="css/tabs-panes.css" rel="stylesheet"/>
            <link media="screen" type="text/css" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" rel="stylesheet" />
            <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
            <script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>
            <script src="http://malsup.github.com/jquery.form.js"></script>
            <script type="text/javascript" src="javascript/script.js"></script>
            <script type="text/javascript" src="javascript/buscaInformacion.js"></script>
            <script type="text/javascript"
                    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDniHj5D2Oiz4gVxpM5xh5_9ANUkjl2Tws&sensor=true">
            </script>

            <script>
                // perform JavaScript after the document is scriptable.
                $(function(){
                    // setup ul.tabs to work as tabs for each div directly under div.panes
                    $("#panes").tabs();
                    $("#buscarArticuloFecha").datepicker({
                        maxDate: 'today',
                        dateFormat: "yy-mm-dd" 
                    });
                });
                
                function showTime(){
                    var time= document.getElementById('tiempo').value;
                    if(time=="multi"){
                        $('#tiemposub').show();
                    }
                    else{
                        $('#tiemposub').hide();                   
                    }
                };
            </script>
    </head>
    <body onload="getArticulos()">
        <header>
            <h1 style="text-align: right;">Bienvenido, <%=usuario.getNombre()%> </h1>
            <form id="form" action="ControlRedireccion" method="post">
                <a class="btnRegresar" style="text-align: right; display: block; margin-bottom: 30px;" onclick="document.getElementById('form').submit()"> Administracion </a>
                <input id="pantalla" name="pantalla" type="hidden" value="administracion.jsp"/>
            </form>
        </header>

        <div id="panes" class="panes">
            <ul class="tabs">
                <li>
                    <a class="current" href="#tabs-1" onclick="addClass(this)">Inicio</a>
                </li>
                <li>
                    <a class="" href="#tabs-2" onclick="addClass(this)">B&uacute;squeda</a>
                </li>
                <%
                    if(usuario.getEstatus() == Constantes.ADMIN)
                    {
                %>
                <li>
                    <a class="" href="#tabs-3" onclick="addClass(this)">Crear revista</a>
                </li>
                <li>
                    <a id="publicacionRevista" class="" href="#tabs-4" onclick="addClass(this);getRevistas();">Publicar revista</a>
                </li>
                <%
                }
                    else
                    {
                %>
                <li>
                    <a class="" href="#tabs-3" onclick="addClass(this)">Subscripci&oacute;n</a>
                </li>
                <%
                    }
                %>
            </ul>
            <div id="tabs-1" class="tab" style="display: block; height: 100%">
                <fieldset id="vistaArticulos" name="vistaArticulos">
                    <legend>Art&iacute;culos</legend>
                   
                </fieldset>
            </div>
            <div id="tabs-2" class="tab" style="display: none;">
                <fieldset id="busquedaArticulos" name="busquedaArticulos">
                    
                    <legend>B&uacute;squeda de art&iacute;culos</legend>
                    <div class="container" style="width: 30%">
                        <span style="display: block; margin-bottom: 15px;">Par&aacute;metros de b&uacute;squeda</span>
                        <br/>
                        <label for="buscarArticuloNombre" style="display: inline; margin: 0px 20px; float: left">Nombre del art&iacute;culo</label>
                        <input type="text" id="buscarArticuloNombre" name="buscarArticuloNombre"/>
                        <br/>
                        <label for="buscarArticuloFecha" style="display: inline; margin: 0px 20px; float: left">Fecha de creaci&oacute;n</label>
                        <input type="text" id="buscarArticuloFecha" name="buscarArticuloFecha"/>
                        <br/>
                        <input type="submit" style="margin-left: 200px" value="Buscar" onclick="getArticulosPorNombreOFecha()"/>
                    </div>
                    
                    <div id="contenedorDeArticulos" class="container" style="display: none;">
                        <span style="display: block; margin-bottom: 15px;">Art&iacute;culos</span>
                        <br/>
                        
                    </div>
                </fieldset>
            </div>
            <div id="tabs-3" class="tab" style="display: none;">
               <fieldset style="width:60%">
                    <legend> Crear una nueva Revista</legend>
                    <%
                    if(usuario.getEstatus() == Constantes.ADMIN)
                    {
                %>
                 <form action="RevistaServlet" method="post">
                   <div class="container" style="width:95%;">
                       <input type="hidden" value="creaRevista" name="metodo" />
                        <label for="nombreRevista">Nombre</label>
                        <input type="text" id="nombreRevista" name="nombreRevista">                            
                        <label for="carta">Carta del editor</label>
                        <textarea id="carta" name="carta"></textarea>                        
                        <label for="costo">Costo</label> 
                        <input type="text" id="costo" name="costo"/><br>
                        <input type="submit" value="crear"/>
                    </div>
                     
		</form>	
                <%
                }
                    else
                    {
                %>
                <form action="SubscripcionServlet" method="post">
                    <p style="font-size:18px;">Subscripci&oacute;n</p>
                    <div class="container" style="width:95%;">
                        <label for="tipo">Especifique el tipo de subscripci&oacute;n</label>
                        <select id="tipo" name="tipo">
                            <option>Personal</option>
                            <option>Corporativa</option>
                        </select>
                    </div>
                    <div class="container" style="width:95%">
                        Seleccione el medio(s)<br> 
                            <input type="checkbox" id="enlinea" name="medio" value="enlinea">En linea</input>
                            <input type="checkbox" id="impreso" name="medio" value="impreso">Impreso</input> 
                    </div>
                    <div class="container" style="width:95%">
                        <label for="tiempo">Indique el tiempo de contrataci&oacute;n</label>                        
                        <select id="tiempo" onchange="showTime()">
                            <option value="anual">anual</option>
                            <option value="multi">multi-anual</option>
                        </select><br><br>
                        <div id="tiemposub" style="display:none">
                            <label for="multianual">Especifique el tiempo de subscripci&oacute;n</label>
                            <select id="multianual" name="multianual" type="text"/>
                            <option value="2">2</option>
                            <option value="3">3</option>
                            <option value="4">4</option>
                            <option value="5">5</option>
                        </select><br><br>
                        </div>
                        <input type="submit" value="Enviar"/>
                    </div>
		</form>	
                <%
                    }
                %>
		
            </fieldset>
            </div>
            <%
                if(usuario.getEstatus() == Constantes.ADMIN)
                {
            %>
            <div id="tabs-4" class="tab" style="display: none;">
                <fieldset id="vistaRevistas" name="vistaRevistas">
                    <legend>Revistas</legend>
                   
                </fieldset>
            </div>
                <%
                }
                %>
        </div>
    </body>
</html>